
<!doctype html>
<html>
<head>
	<meta charset="utf-8" />
	<link rel="stylesheet" type="text/css" href="/css/css.css" />
	<script src="/js/jquery.min.js"></script>
	<script src="/js/public.js"></script>
	<script src="/js/payFluxPage.js"></script>
	<title>续费</title>
	<style type="text/css">
	</style>
</head>
<body>
	<input type="hidden" class="fluxPriceBox" value="{{ $price or .5 }}" />
	<input type="hidden" class="residualFlow" value="{{ $state['residualFlow'] or 0}}" />
	<input type="hidden" class="recharge_mode" value="{{ $recharge_mode }}">
	<!-- 确认取消提示start -->
	<section class="selectMode">按计量模式续费</section>
	<section class="inputBoxList">
		<section class="writeBox">
			<p class="money">
				缴费(元)：
				<input class="numberInt" type="number" placeholder="输入1代表100" oninput="myFunction()" > x 100
			</p>
			<p class="flux" style="">
				<span style="">流量(升)：</span>
				<sapn class="fluxBox" style="display:inline-block; width: 8rem;height:1rem;margin-bottom:-.3rem;color:#A9A9A9; "></sapn>
			</p>
		</section>
	</section>
	<section class="payPrompt">鹤庭流量{{ $price }}元每升，根据您的需要选择续费</section>
	<section class="payList">
		<a>
			<span>100</span>&nbsp;&nbsp;元
			<span>{{ round(100/$price) }}</span>升
		</a>
		<a>
			<span>500</span>&nbsp;&nbsp;元
			<span>{{ round(500/$price) }}</span>升
		</a>
		<a>
			<span>1000</span>元
			<span>{{ round(1000/$price) }}</span>升
		</a>
		
	</section>
<!-- 	
	<section class="selectMode">按套餐模式续费</section> 
	<section class="renewalsHint">提示：若按套餐模式续费请到经销处续费</section> -->
	<!-- 提交信息服务器反馈提示信息-->
	<section class="hint_bg">
		<section class="hint_box">
			<p class="hint_text"></p>
			<section class="hint_btn">确定</section>
		</section>
	</section>
	<section class="bottomBtn">
		<a class="return" onclick="window.location.href='/index';">返回</a>
		<a class="payBtn">续费</a>
	</section>
	<!-- 提交信息服务器反馈提示信息-->
	<section class="hint_bg">
		<section class="hint_box">
			<p class="hint_text"></p>
			<section class="hint_btn">确定</section>
		</section>
	</section>
	<script>
	//当输入购买金额，显示购买流量
	function myFunction(){
		var fluxNum=Math.round($(".numberInt").val()*100/$(".fluxPriceBox").val());
		if($(".payList > a").hasClass("pActive")){
			hint('您已经选了购买项，请点击"支付"');
			$(".numberInt").val("");
		}else if(fluxNum+parseInt($('.residualFlow').val())>65000){
			hint('单次计量续费数值过大，请重新输入！');
			$(".numberInt").val("");
		}else{
			$(".fluxBox").html(fluxNum);
		}
	}
	</script>
</body>
</html>
